<template>
  <div class="content_out">
    <div class="w100h100 group_title">集团简介</div>
    <div class="w100h100 group_en_title">Group Profile</div>
    <b-container fluid class="contents">
      <b-row>
        <b-col md="9" sm="12" class="about_left_intro">
          <p>
            成都新都投资集团有限公司是经新都区委区政府同意，于2023年7月由新都区国资金融局出资，整合划转区内国有资产组建成立的区属重点国有独资企业。集团注册资本20亿元，资产规模超百亿元，现有员工150余人。</p>
            <p>经新都区委、区政府授权，新投集团开展新都区域内文旅项目投资开发、智慧城市运营维护、终端人才市场服务、城市基础设施建设、环境建设维保及政府鼓励类产业项目的投融资，致力于构建“1个资本运营总部”和“文旅开发、智慧城市、人才建链、环境建设”4大板块的“1+4+N”产业结构布局，</p>
            <p>锚定“新时代城市运营服务商”，优化资源配置，提升发展效能，全力服务“一心三区”战略部署，助推新都经济社会高质量发展。</p>

        </b-col>
        <b-col md="3" sm="12" class="about_right_img">
          <b-img src="/img/test1.png"></b-img>
        </b-col>
      </b-row>
    </b-container>
    <div class="middle_icon">
      <div class="items">
        <div class="contents">文旅开发</div>
      </div>
      <div class="items">
        <div class="contents">文旅开发</div>
      </div>
      <div class="items">
        <div class="contents">文旅开发</div>
      </div>
      <div class="items">
        <div class="contents">文旅开发</div>
      </div>
      <div class="items">
        <div class="contents">文旅开发</div>
      </div>
    </div>

    <div class="video">
      <video
        src="http://easydatacloud-ali1.oss-cn-chengdu.aliyuncs.com/e2152e52-e30b-46cc-88cd-fb336e2e951f.mp4"
        autoplay
        muted
        loop
        style="width:100%;height:100%"
      />
    </div>
  </div>
</template>
<script>
export default {
  name: 'introduceComponents'
}
</script>

<style scoped lang="scss">
$mobile-width: 0;
$pad-width: 576px;
$pc-width: 1024px;

@mixin mobile {
  @media (min-width: $mobile-width) {
    @content;
  }
}

@mixin pad {
  @media (min-width: $pad-width) {
    @content;
  }
}

@mixin pc {
  @media (min-width: $pc-width) {
    @content;
  }
}
.w100h100{
  width: 100%;
  //height: 100%;
}
.group_title{
  margin-top: 20px;
  color:#212121;
  font-size: 1.9rem;
  text-align: center;
}
.group_en_title{
  color:rgba(0,0,0,0.5);
  font-size: 1.2rem;
  text-align: center;
}
.contents{
  margin-top:10px;
  .about_left_intro{
    padding:10px;
    font-size:1rem;
    line-height:180%;
    color:#464646;
  }
  .about_right_img{
    padding:10px;
    img{
      max-width: 100%;
    }
  }
}
.middle_icon{
  width:100%;
  margin:20px auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  .items{
    width:230px;
    height:80px;
    background: url(/img/intro/line.png) no-repeat right center;
    &:last-child{
      background: none;
    }
    @media (max-width: 576px) {
      background: none;
    }
    .contents{
      width:100%;
      height:100%;
      display: flex;
      justify-content: center;
      align-items: end;
      font-size: 0.8rem;
      color:#fff;
      background-repeat: no-repeat;
      background-position: center 4px;
      color:#232323;
      box-sizing: border-box;
      padding-bottom:20px;
    }
    @for $i from 1 through 5 {
      &:nth-child(#{$i}){
        .contents{
          background-image: url(/img/intro/icon#{$i}.png);
        }
      }
    }

  }
}
.video{
  width:100%;
  margin-bottom:20px;
  @include mobile {

    height:209px
  }
  @include pad {

    height:359px
  }

  @include pc {

    height: 429px;
  }
  video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
</style>
